<!--
 * @Description: 工具栏
 * @LastEditors: xzh
 * @LastEditTime: 2024-06-10 14:05:22
-->
<template>
  <div class="head-container">
    <el-image :src="navbarParam.src" fit="fill" />
    <NavTools isDashboard />
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted, toRefs } from "vue";
import NavTools from "@/layout/components/navBar/nav-tools/index.vue";
import { object_Inf } from "@/utils/typings/index.type";
let navbarParam = reactive<object_Inf>({
  imagesMoudle: (import.meta as any).glob("/src/assets/images/*.png"),
  src: "",
});
/**
 * @Author: xzh
 * @Descripttion: 初始化
 * @Param:
 */
onMounted(async () => {
  let { src } = toRefs(navbarParam);
  src.value = await getLogoSrc();
});

/**
 * @Author: xzh
 * @Descripttion: 获取图片地址
 * @Param:
 */
let getLogoSrc = async () => {
  let imageMoudle = await navbarParam.imagesMoudle[
    "/src/assets/images/cx_logo.png"
  ]();
  return imageMoudle.default;
};
</script>
<style lang="scss" scoped>
.head-container {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 3%;
  > div {
    display: flex;
    gap: 2rem;
    align-items: center;
    &:is(.el-image) {
      height: 1.2rem;
    }
  }
}
</style>
